import Vue from 'vue'
import Vuex from 'vuex'
import createpPersistedstate from 'vuex-persistedstate'

Vue.use(Vuex)

//state储存数据
//mutations： 修改state的数组
// - vuex的数据是自产自销的
// - 方法名字的规范，建议是全大写+_
// - mutaion都有两个参数
//   - state :获取存储数据
//   - payload :载荷，调用函数传递的参数

//vuex-persistedstate
// - persisted 持久化
// - 使用
// - 下载 ： yarn add vuex-persistedstate@3.2.1
// - 引入 ： import createpPersistedstate from 'vuex-persistedstate'
// - 配置 ： store：{ plugins: [createpPersistedstate()] }
// - 配置项：
//    - key :指定持久化的名字，默认的名字是vuex
//    - storage : 选用一种持久化的方案，默认是本地储存
//    - reducer ：用于指定哪些属性需要持久化，不指定reduce，默认vuex所有的数据都会被持久化
//                 reducer是一个函数,这个函数必须返回一个对象，这个对象就会被持久化
//                 这个函数的参数是state
export default new Vuex.Store({
  //配置vuex的插件
  plugins: [
    createpPersistedstate({
      key: 'HEIMA_TOUTIAO',
      //storage:window.sessionStorage
      reducer({ tokenObj, myChannels, histories }) {
        return { tokenObj, myChannels, histories }
      }
    })
  ],
  state: {
    tokenObj: {},
    myChannels: [],
    histories: []
  },
  getters: {
    isLogin(state) {
      return !!state.tokenObj.token
    }
  },
  mutations: {
    SET_TOKEN(state, tokenObj) {
      state.tokenObj = tokenObj
    },
    SET_MY_CHANNELS(state, channels) {
      state.myChannels = channels
    },
    SET_HISTORIES(state, histories) {
      state.histories = histories
    }
  },
  actions: {},
  modules: {}
})
